<template>
	<view v-if="list&&list.length>0" class="cu-card case" :class="props.isCard?'no-card':''">
		<view class="cu-item shadow padding" v-for="(item,index) in list" :key="index" :data-index="index"
			:data-value="item" @click="handleSelect">
			<view class="flex align-center padding-xs">
				<view class="flex align-center">
					<view class="cu-avatar lg round" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg);"></view>
					<view class="margin-left-xs">
						<view class="flex justify-between align-center">
							<view class="text-sigle" style="width: 80px;">{{item.title}}</view>
							<view class="text-size-14" style="width: 120px;">
								{{item.releaseTime}}
							</view>
						</view>
				
						<view class="text-sigle" style="width: 220px;">
							{{item.content}}
						</view>
					</view>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import {
		useSettingStore
	} from '@/stores/index';
	import {
		watch,
		computed,
		ref
	} from "vue";
	const setting = useSettingStore();
	const emit = defineEmits(['action']);
	const props = defineProps({
		isCard: {
			type: [Boolean, String],
			default: false
		},
		bgImage: {
			type: String,
			default: ''
		},
		list: Array
	})
	const handleSelect = (e) => {
		emit('action', e)
	}
</script>

<style>
	.cu-item {
		margin-top: 0;
		border: 1px solid #EFEFEF;
	}
	.cu-card>.cu-item {
	    display: block;
	    background-color: #ffffff;
	    overflow: hidden;
	    border-radius: 10rpx;
	    margin: 0rpx 30rpx 30rpx 30rpx;
	}
</style>
